.sidebar-nav,
.sidebar-nav ul {
    list-style: none;
    padding: 0px;
}

.sidebar-nav > li:nth-child(odd),
.sidebar-nav ul li {
    background: #f0f0f0;
}
.sidebar-nav > li:nth-child(even),
.sidebar-nav ul > li{
    background: #fff;
}

.sidebar-nav li {
    text-indent: 4px;
    line-height: 30px;
}

.sidebar-nav li li {
    text-indent: 15px;
}

.sidebar-nav li li li {
    text-indent: 25px;
}

.sidebar-nav li a {
    display: block;
    text-decoration: none;
    color: #333;
}

.sidebar-nav li.active a {
    background-color: #3e99ff;
}

.sidebar-nav li a>i+span {
    margin-left: 3px;
}

.sidebar-nav li a:hover {
    text-decoration: none;
    background: rgba(255, 255, 255, 0.2);
}

.sidebar-nav li a:active, .sidebar-nav li a:focus {
    text-decoration: none;
}

.middle-wrapper h4,
.right-wrapper h4 {
    font-size: 1em;
    height: 40px;
    border-bottom: solid 1px #e7e7e7;
    text-align: center;
    line-height: 40px
}

.demo {
    /* for IE10+ touch devices */
    touch-action:none;
}

.flowchart-demo .window {
    border: 1px solid #346789;
    box-shadow: 2px 2px 19px #aaa;
    -o-box-shadow: 2px 2px 19px #aaa;
    -webkit-box-shadow: 2px 2px 19px #aaa;
    -moz-box-shadow: 2px 2px 19px #aaa;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    opacity: 0.8;
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    text-align: center;
    z-index: 20;
    position: absolute;
    background-color: #eeeeef;
    color: black;
    font-family: helvetica, sans-serif;
    padding: 0.5em;
    font-size: 0.9em;
    -webkit-transition: -webkit-box-shadow 0.15s ease-in;
    -moz-transition: -moz-box-shadow 0.15s ease-in;
    -o-transition: -o-box-shadow 0.15s ease-in;
    transition: box-shadow 0.15s ease-in;
}

.flowchart-demo .window:hover {
    box-shadow: 2px 2px 19px #444;
    -o-box-shadow: 2px 2px 19px #444;
    -webkit-box-shadow: 2px 2px 19px #444;
    -moz-box-shadow: 2px 2px 19px #444;
    opacity: 0.6;
}

.flowchart-demo .active {
    border: 1px dotted green;
}

.flowchart-demo .hover {
    border: 1px dotted red;
}

.flowchart-demo .jtk-connector {
    z-index: 4;
}

.flowchart-demo .jtk-endpoint, .endpointTargetLabel, .endpointSourceLabel {
    z-index: 21;
    cursor: pointer;
}

.flowchart-demo .aLabel {
    background-color: white;
    padding: 0.4em;
    font: 12px sans-serif;
    color: #444;
    z-index: 21;
    border: 1px dotted gray;
    opacity: 0.8;
    cursor: pointer;
}

.flowchart-demo .aLabel.jtk-hover {
    background-color: #5C96BC;
    color: white;
    border: 1px solid white;
}

.window.jtk-connected {
    border: 1px solid green;
}

.jtk-drag {
    outline: 4px solid pink !important;
}

path, .jtk-endpoint {
    cursor: pointer;
}

.jtk-overlay {
    background-color:transparent;
}

.button-remove {
    font-size: 8pt;
    color: darkgrey;
    border-radius: 30%;
    box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
    width: 13px;
    height: 13px;
    line-height: 13px;
    text-align: center;
}

.button-remove:hover {
    background-color: #216477;
    color: white;
}

.po_r{
    position: relative;
}
.po_a{
    position: absolute;
    right: 2px;
    top: 0px;
}